<template>
  <div class="follow-gzh" v-if="isIos">
    <!-- v-if="isIos && !useInfo.subscribe" -->
    <van-cell @click="clickme" :border="false">
      <template #icon>
        <image mode="scaleToFill" :src="imgSrc" :show-menu-by-longpress="true"></image>
      </template>
      <template #title>
        <div class="flex">
          <div>长按二维码</div>
          <div>关注公众号，获取更多</div>
        </div>
      </template>
      <template #right-icon>
        <div class="boxBtn">关注公众号</div>
      </template>
    </van-cell>
  </div>
</template>

<script setup>
import { computed, ref } from 'vue';
import { getIsIos } from '@/utils/host';
import { useUserStore } from '@/store/modules';
import projectConfig from '@/config/project/index.js'
let userStore = useUserStore();
const useInfo = computed(() => {
  return userStore.userInfo;
});
let isIos = ref(false);
getIsIos({
  fn: (res) => {
    isIos.value = res;
  }
});
function clickme() {
  wx.previewImage({
    // current: '', // 当前显示图片的http链接
    urls: [imgSrc] // 需要预览的图片http链接列表
  })
}
let imgSrc = projectConfig.followGzhUrl
</script>

<style lang="less" scoped>
.follow-gzh {
  // margin: 40rpx;
  background-color: var(--a-main-box-bg-color);

}

.box {
  width: 682rpx;
  height: 124rpx;
  background: #FFFFFF;
  border-radius: 24rpx;
}

image {
  display: block;
  width: 80rpx;
  height: 79rpx;
  // border-radius: 50%;
}

.flex {
  transform: translate(40rpx, -10rpx);
  color: var(--a-one-text-color);
  font-size: 26rpx;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.boxBtn {
  width: 151rpx;
  height: 60rpx;
  line-height: 60rpx;
  background: #83CD88;
  border-radius: 30rpx;
  font-size: 26rpx;
  color: var(--a-main-Feature-text-color);
  text-align: center;
  margin: auto 0;
}
</style>
